@charset "utf-8";

@scale:1;
@color:#e46406;
@bzcolor:#331702;
@cengHeight:2800px * @scale;
@Houdu18:18px * @scale;
@Houdu9:9px * @scale;

//餐边柜、鞋柜
@canbianguiwidth:2880px * @scale;
@canbianguiHoudu: 600px * @scale;
@neibuHeight:@cengHeight - @Houdu18 * 2;
@neibuHoudu:@canbianguiHoudu - @Houdu18 * 2;
@jianyigebanHeight:@cengHeight - @Houdu18;

@chuanxiedengwidth:600px * @scale;  //固定 穿鞋凳宽度60cm
@xieguiwidth:1084px * @scale;
@sanjiaoguiwidth:300px * @scale;
@bingxiangwidth:860px * @scale; //一般冰箱宽度833，两边各留15mm散热，大约留860mm
@sanjiaoguiHoudu:450px * @scale;
@neibu2Houdu:@sanjiaoguiHoudu - @Houdu18 * 2;


@dingguiHeight: 900px * @scale;
@jingziHeight: 1400px * @scale; // 固定 镜子高1800mm
@xiedengHeight: 464px * @scale;

@dinggui2Height: 1300px * @scale;
@caoHeight: 420px * @scale;  //固定 洞口高度40cm
@diguiHeight: 912px * @scale;
@tixiequHeight: 150px * @scale; //固定 踢鞋区高度15cm
@choutiHeight: 300px * @scale;
@xiaxieguiHeight: 594px * @scale;
@bingxiangguiHeight: 882px * @scale;
@bingxiangquHeight: 1900px * @scale;    //一般冰箱高度1750+，再多留100mm散热，大约留1900mm

body{
    background: black;
    color: white;
    margin: 100px;
    width: 5000px;
    height: 5000px;
    font-size: 80px;
    .person{
        width: 450px;
        height: 1750px;
        position: absolute;
        background: red;
        bottom: -@Houdu18;
        display: none;
    }
    .rule, .ruleWC{
        position: relative;
    }
    .ruleW, .ruleWCW{
        background: #662d2d;
        color: white;
        text-align: center;
        top: 25px;
        height: 25px;
        line-height: 25px;
        position: absolute;
        width: 100%;
        display: none;
    }.ruleWCW{
        top: -75px;
    }
    .ruleH, .ruleWCH{
        background: #662d2d;
        color: white;
        height: 100%;
        position: absolute;
        width: 25px;    
        left: 25px;
        display: none;
    } 
    .ruleWCH{
        left: -75px;
    }
    .txt{
        color: yellow;
        text-align: center;
        position: absolute;
        width:100%;
        top:50%;
        display: none;
    }
    .gm{
        perspective: 3200px;
        .guimen{
            position: absolute;
            width: 100%;
            height: 100%;
            background: #793300;
            display: none;
        }
        .guimen顶柜{
            transform-origin: left;
            transform: rotate3d(0, 1, 0, -50deg);
        }
        .guimen顶柜2{
            width: 50%;
            transform-origin: left;
            transform: rotate3d(0, 1, 0, -20deg);
        }
        .guimen顶柜22{
            width: 50%;
            right: 0;
            transform-origin: right;
            transform: rotate3d(0, 1, 0, 20deg);
        }
        .guimen鞋柜{
            width: 50%;
            transform-origin: left;
            transform: rotate3d(0, 1, 0, -20deg);
        }
        .guimen鞋柜2{
            width: 50%;
            right: 0;
            transform-origin: right;
            transform: rotate3d(0, 1, 0, 20deg);
        }
        .guimen斜柜{
            transform-origin: right;
            transform: rotate3d(0, 1, 0, 60deg);
        }
        .guimen顶柜3{
            width: 50%;
            transform-origin: left;
            transform: rotate3d(0, 1, 0, -20deg);
        }
        .guimen顶柜32{
            width: 50%;
            right: 0;
            transform-origin: right;
            transform: rotate3d(0, 1, 0, 20deg);
        }
        .transformNone{
            transform:none;
        }
    }
    .box{
        position: absolute;
        top: 100px;
        right:130px;
        width:400px;
        background: black;
        color: white;
    }
    input[type=checkbox]{
        width: 70px;
        height: 70px;
    }
    .shuomingArea{
        display: none;
        .shuoming1{
            position: absolute;
            left: 100px;
            top: 800px;
        }
        .shuoming2{
            position: absolute;
            bottom: 400px;
            left: 200px;
        }
        .shuoming3{
            position: absolute;
            top: 1200px;
            left: 1000px;
        }
        .shuoming4{
            position: absolute;
            top: 1900px;
            left: 1000px;
        }
        .shuoming5{
            position: absolute;
            top: 2000px;
            left: 1000px;
        }
        .shuoming6{
            position: absolute;
            left: 1500px;
            top: 1500px;
        }
        .shuoming7{
            position: absolute;
            left: 2300px;
            top: 800px;
        }
    }

}
//主视图
.canbiangui1{
    width: @canbianguiwidth;
    height:@cengHeight;
    border: solid @Houdu18 @color;
    box-sizing: border-box;
    float: left;
    background: @bzcolor;
    position: relative;
    //穿鞋凳区域
    .chuanxiedeng{
        width: @chuanxiedengwidth;
        height:@neibuHeight;
        border-right: solid @Houdu18 @color;
        float: left;
        box-sizing: border-box;
        .dinggui{
            height:@dingguiHeight;
            border-bottom: solid @Houdu18 @color;
            box-sizing: border-box;
            position: relative;
        }
        .jingzi{
            height:@jingziHeight;
            box-sizing: border-box;
            position: relative;
        }
        .xiedeng{
            height:@xiedengHeight;
            border-top: solid @Houdu18 @color;
            box-sizing: border-box;
            position: relative;
        }
    }
    //鞋柜区域
    .xiegui{
        width: @xieguiwidth;
        height:@jianyigebanHeight;
        background: @bzcolor;
        border-right: solid @Houdu18 @color;
        float: left;
        box-sizing: border-box;
        .dinggui2{
            height:@dinggui2Height;
            border-bottom: solid @Houdu18 @color;
            box-sizing: border-box;
        }
        .cao{
            height:@caoHeight;
            border-bottom: solid @Houdu18 @color;
            box-sizing: border-box;
        }
        .digui{
            height:@diguiHeight;
            border-bottom: solid @Houdu18 @color;
            box-sizing: border-box;
            .chouti{
                height:@choutiHeight;
                border-bottom: solid @Houdu18 @color;
                box-sizing: border-box;
            }
            .xiaxiegui{
                height:@xiaxieguiHeight;
                box-sizing: border-box;
            }
        }
        .tixiequ{
            height:@tixiequHeight;
            box-sizing: border-box;
        }
    }
    //三角柜区域
    .sanjiaogui{
        width: @sanjiaoguiwidth;
        height:@neibuHeight;
        border-right: solid @Houdu18 @color;
        float: left;
        box-sizing: border-box;
    }
    //冰箱区域
    .bingxiang{
        width: @bingxiangwidth;
        height:@jianyigebanHeight;
        background: @bzcolor;
        float: left;
        box-sizing: border-box;
        .bingxianggui{
            height:@bingxiangguiHeight;
            border-bottom: solid @Houdu18 @color;
            box-sizing: border-box;
        }
        .bingxiangqu{
            height:@bingxiangquHeight;
            box-sizing: border-box;
        }
    }
}
//侧视图
.canbiangui2{
    width: @canbianguiHoudu;
    height:@cengHeight;
    margin-left: 800px;
    border: solid @Houdu18 @color;
    border-left: solid @Houdu9 @color;
    float: left;
    box-sizing: border-box;
    background: @bzcolor;
    //三角柜区域
    .sanjiaogui{
        width: @sanjiaoguiHoudu;
        height:@neibuHeight;
        border-right: solid @Houdu18 @color;
        float: left;
        box-sizing: border-box;
    }
}
//俯视图
.canbiangui3{
    margin-top: 200px;
    float: left;
    box-sizing: border-box;
    background: @bzcolor;
    width: @canbianguiwidth;
    height:@canbianguiHoudu;
    //左区
    .zuo{
        width: @chuanxiedengwidth + @xieguiwidth;
        height:@sanjiaoguiHoudu;
        border: solid @Houdu18 @color;
        border-top: solid @Houdu9 @color;
        border-right:none;
        float: left;
        box-sizing: border-box;
        .chuanxiedeng{
            width: @chuanxiedengwidth;
            height:@neibu2Houdu;
            border-right: dashed @Houdu18 @color;
            float: left;
            box-sizing: border-box;
        }
        .xiegui{
            width: @xieguiwidth - @Houdu18;
            height:@neibu2Houdu;
            float: left;
            box-sizing: border-box;
        }
    }
    //右区
    .you{
        width: @bingxiangwidth + @Houdu18 + @Houdu18;
        height:@canbianguiHoudu;
        border: solid @Houdu18 @color;
        border-left-style:dashed;
        border-top: solid @Houdu9 @color;
        float: left;
        box-sizing: border-box;
    }
    //中区
    .zhong{
        width: @sanjiaoguiwidth;
        height:@sanjiaoguiHoudu;
        border: solid @Houdu18 @color;
        border-left-style:dashed;
        border-top: solid @Houdu9 @color;
        border-right:none;
        border-bottom:none;
        float: left;
        box-sizing: border-box;
        position: relative;
        //斜线
        .xiexian{
            width:340px;
            height: 0;
            border-top: solid @Houdu18 @color;
            float: left;
            box-sizing: border-box;
            position: absolute;
            left: -@Houdu18;
            margin-top: @sanjiaoguiHoudu -  @Houdu18 -  @Houdu9;
            transform: rotate(26deg);
            transform-origin: left;
        }
    }
}